﻿@model  List<Data.Web.Images>

@{  
    var Media = System.Configuration.ConfigurationManager.AppSettings["Media"];

    Layout = "~/Views/Shared/_LayoutImage.cshtml";
}
@using (Html.BeginForm(FormMethod.Get))
{ 
    
    <a href="#" id="modal_link">Tải ảnh </a>
    @Html.DropDownList("CateId")
    <input type="submit" value="Tìm kiếm" /> 
}
<style type="text/css">
    #rows .row {
        width: 50%;
        min-width: 511px;
        float: left;
    }

    .col-xs-9 {
        margin-right: 2%;
        width: 73%;
    }
</style>
<script type="text/javascript">
    //$(document).ready(function () { 
    //    $(document).on('click focus', ".form-control", function () {
    //        $(this).select();
    //    });
    //});

</script>
@if (Model.Count > 0)
{
    
    <div id="rows">
        @foreach (var item in Model)
        { 
            <div class="row">
                <div class="col-xs-3">
                    <img class="img-responsive" src="@Html.Raw(Media + "Thumbnail/" + item.Url)">
                </div>
                <div class="col-xs-9"> 
                    @using (Html.BeginForm("Delete", "Media"))
                    {
                        <p style="font-weight: bold;">@item.Title</p>
                        <div class="input-group">
                            <input class="form-control" type="text" value="@item.Url" short="@item.Url" long="@item.Url" title="Path">
                            <input class="form-control" type="text" value="@Html.Raw(Media + item.Url)" title="Full Link"> 
                            <span class="input - group - btn">
                                <input type="hidden" name="Id" value="@item.Id" />
                                <a class="btn green" target="_blank" href="@Html.Raw(Media + item.Url)">View Full </a>
                                <a class="btn green" target="_blank" href="/Media/edit/@item.Id">Sửa</a>
                                <input type="submit" value="Xóa" class="btn red deletelink" />
                            </span>
                        </div>
                    }  
                </div>
            </div> 
        }
    </div>
}
else
{
    <div class="imageCenter">
        Không có hình ảnh đã được tải lên cho đến nay. @Html.ActionLink("Click here", "UploadImage") để tải lên một hình ảnh.
    </div>
}
<div class="clear"></div>
@section Styles
{
    <link href="@Url.Content("~/Content/Media/Modal.css")" rel="stylesheet" />
    <link href="@Url.Content("~/Content/Media/ImageArea.css")" rel="stylesheet" />
}
@section Scripts
{
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")"></script>
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.imgareaselect.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.fancyupload.js")"></script>
    <script>
        $(document).ready(function () {
            $('.modal_block').click(function (e) {
                $('#tn_select').empty();
                $('.modal_part').hide();
            });
            $('#modal_link').click(function (e) {
                $('.modal_part').show();
                var context = $('#tn_select').load('/Media/UploadImage', function () {
                    initSelect(context);
                });
                e.preventDefault();
                return false;
            });
        });
    </script>
}
<div class="modal_block modal_part"></div>
<div class="modal_dialog modal_part" id="tn_select"></div>


